<template>
  <div class="CertificateTable relative">
    <vxe-table border show-overflow :data="listData" height="300">
      <vxe-column type="seq" title="序号" width="60"></vxe-column>
      <vxe-column field="sample_order_num" title="样品单号"></vxe-column>
      <vxe-column field="custom_sku" title="SKU/自定义SKU">
        <template #default="{ row }">
          {{ row.goods_sku }} / {{ row.custom_sku }}
        </template>
      </vxe-column>
      <vxe-column field="inspection_results" title="检测状态">
        <template #default="{ row }">
          {{ row.detection_status_text }}
        </template>
      </vxe-column>
      <vxe-column field="testing_personnel_id_text" title="检测人"></vxe-column>
      <vxe-column field="detection_time" title="检测时间"></vxe-column>
      <vxe-column field="remark" title="操作">
        <template #default="{ row }">
          <el-button link type="primary" @click="check(row)">查看</el-button>
        </template>
      </vxe-column>
    </vxe-table>
    <uploadPictures ref="uploadPictureRef"/>
  </div>
</template>
<script setup name="CertificateTable">
import { onMounted } from 'vue'
import uploadPictures from "../../../sample-list/components/uploadPictures";
import { getInspectionReport } from './api'
let formData = reactive(inject('form'))
const listData = ref([])

const getList = () => {
  getInspectionReport({
    goods_spu: formData.value.spu
  }).then(res => {
    if (res.data) {
      listData.value = res.data
    }
  })
}
onMounted(() => {
  getList()
})

const uploadPictureRef = ref()
const check = (item) => {
  nextTick(() => {
    uploadPictureRef.value.open({
      sampleOrderNum: item.sample_order_num,
      spu: item.goods_spu,
      sample_id: item.sample_id,
      goods_sku: item.goods_sku,
      product_list: [{goods_sku: item.goods_sku}]
    }, 'view');
  })
}
</script>

<style lang="scss" scoped></style>